﻿@model IList<HZU.ZP.Domain.Model.Message>
@{
    switch (User.Claims.ToList()[2].Value)
    {
        case "Company":
            Layout = "_CompanyLayout";
            break;
        case "Applicant":
            Layout = "_ApplicatLayout";
            break;
    }
}
<style>
    #message {
        height: 400px;
        overflow: auto;
        box-shadow: 0 0 2px #D3D3D3 inset;
    }

    #user {
        height: 480px;
        overflow: auto;
        box-shadow: 0 0 2px #D3D3D3 inset;
    }

    #message::-webkit-scrollbar { /*滚动条整体样式*/
        width: 5px; /*高宽分别对应横竖滚动条的尺寸*/
        height: 0;
    }

    #message::-webkit-scrollbar-thumb { /*滚动条里面小方块*/
        border-radius: 2px;
        -webkit-box-shadow: inset 0 0 2px rgba(0,0,0,0.2);
        background: #d1d4db;
    }

    #message::-webkit-scrollbar-track { /*滚动条里面轨道*/
        -webkit-box-shadow: none;
        border-radius: 0px;
        /*background: #EDEDED;*/
    }

    #user::-webkit-scrollbar { /*滚动条整体样式*/
        width: 0px; /*高宽分别对应横竖滚动条的尺寸*/
        height: 0;
    }

    #user::-webkit-scrollbar-thumb { /*滚动条里面小方块*/
        border-radius: 2px;
        -webkit-box-shadow: inset 0 0 2px rgba(0,0,0,0.2);
        background: #d1d4db;
    }

    #user::-webkit-scrollbar-track { /*滚动条里面轨道*/
        -webkit-box-shadow: none;
        border-radius: 0px;
        /*background: #EDEDED;*/
    }

    .owner {
        float: right;
        /*width:50%;*/
        background-color: #62d5c8;
        color: #fff;
        word-wrap: break-word;
        word-break: break-all;
        font-size: large;
        display: inline-block;
    }

    .target {
        /*clear:both;
        width:50%;*/
        background-color: gold;
        color: #fff;
        /*background-color:red;*/
        word-wrap: break-word;
        word-break: break-all;
        font-size: large;
        display: inline-block;
    }
</style>
<script src="~/lib/signalr/dist/browser/signalr.min.js"></script>
<script src="~/lib/mysignalr.js"></script>
<script type="text/javascript">
    var toEmail, toName;
    var toEmailArray = new Array();
    @{
        var toEmail = new List<string>();
        string toEmailStr="";
        foreach (var mes in Model)
        {
            if (mes.FromEmail != User.Identity.Name)
            {
                toEmailStr = toEmailStr + mes.FromEmail + ",";
            }
            else
            {
                toEmailStr = toEmailStr + mes.ToEmail + ",";
            }
        }
        if (toEmailStr.Length > 0)
        {
            toEmailStr = toEmailStr.Substring(0, toEmailStr.Length - 1);
        }

            }
            toEmailArray = "@toEmailStr".split(",");
            //signalr_connection在mysignalr.js定义
            signalr_connection.on("ReceiveMessage", function (message) {
                var index = $.inArray(message.fromEmail,toEmailArray);
                if (index == -1) {
            $("#user").prepend("<div class=\"eee\" data-toemail=\"" + message.fromEmail + "\" data-toname=\"" + message.fromName + "\"><h2>" + message.fromName + "<span id=\"red\" style=\"color:red;\">&nbsp;&nbsp;&nbsp;&nbsp;(未读)</span></h2></div>");
                }
                else {
                    if (toEmail != message.fromEmail) {
                $(".eee").eq(index).remove();
                $("#user").prepend("<div class=\"eee\" data-toemail=\"" + message.fromEmail + "\" data-toname=\"" + message.fromName + "\"><h2>" + message.fromName + "<span id=\"red\" style=\"color:red;\">&nbsp;&nbsp;&nbsp;&nbsp;(未读)</span></h2></div>");
                    }
                    else {
                $("#message").append("<div style=\"width:70%; clear:both;\"><p class=\"target\">"+message.body+"</p></div>");
                        var height=$("#message")[0].scrollHeight;
                $("#message").scrollTop(height);
                $.ajax({
                        type: "post",
                url: "/Message/Update",
                data: "id=" + message.id,
                async: true,
                success: function (message) {
                            }
                        });
                    }
                }
            });
    $(document).ready(function () {
         $(document).on("mouseover", ".eee", function () {
            $(this).css({ "background-color": "gainsboro" });
                })
         $(document).on("mouseout", ".eee", function () {
            $(this).css({ "background-color": "" });
                });
        $(document).on("click", ".eee", function () {

                    toEmail = $(this).data("toemail");
                    toName = $(this).data("toname");
                 $(this).find("span").remove();
                 $(".eee").find("h2").css("background-color", "");
                 $(this).find("h2").css("background-color", "gainsboro");
            $("#message").empty();
            document.getElementById("save").disabled = false;
            $.ajax({
                    type: "post",
                url: "/Message/UpdateList",
                data: "fromEmail="+toEmail+"&toEmail=@User.Identity.Name",
                async: true,
                success: function (message) {
                        }
                    });
                 $.ajax({
                    type: "get",
                url: "/Message/GetMes",
                data: "fromEmail=@User.Identity.Name&toEmail=" + toEmail,
                async: false,
                success: function (message) {
                            var strings="";
                    $.each(message.messages, function (i, items) {
                        if (items.toId != "@(User.Identity.Name+User.Claims.ToList()[2].Value)") {

                                    strings = strings + "<div style=\"width:70%; float:right;\"><p class=\"owner\">" + items.body + "</p></div>";
                                }
                                else {

                                    strings = strings + "<div style=\"width:70%; clear:both;\"><p class=\"target\">"+items.body+"</p></div>";
                                }
                            });
                    $("#message").prepend(strings);
                        }
                    });
                    var height=$("#message")[0].scrollHeight;
                 $("#message").scrollTop(height);
                });
            });
    function btnSendMsg() {
                var $btn = $("#save").button('loading');
                var message = new Object();
                message.fromEmail = "@User.Identity.Name";
                message.toEmail = toEmail;
                message.toId = toEmail+"@(User.Claims.ToList()[2].Value.Equals("Company")?"Applicant":"Company")";
                message.fromName = "@Html.Raw(ViewData["FromName"])";
        message.toName = toName;
        message.body = $("#body").val();
        if (message.body == ""||$.trim(message.body)=="") {
            alert("聊天内容不能为空！");
            $btn.button('reset');
            return false;
        }
             $.ajax({
                url: '/Message/PostData',
                 type: 'post',
                 contentType: "application/json",
                 data: JSON.stringify(message),
                  dataType: "json",
                async: true,
                success: function (message) {
                        if (message.returnCode == '001') {
                        $btn.button('reset');
                        $("#message").append("<div style=\"width:70%; float:right;\"><p class=\"owner\">" + $("#body").val() + "</p></div>");
                            var height=$("#message")[0].scrollHeight;
                        $("#message").scrollTop(height);
                        $("#body").val("");
                        }
                        else {
                            alert("发送失败");
                        $btn.button('reset');
                        }
                    }
                });
            }
     $(function () {
        $(".eee").eq("0").click();
        });
</script>

<div class="container">
    <div class="row clearfix">
        <div style="width:30%;float:left;">
            <div id="user">
                @foreach (var mes in Model)
                {
                    if (mes.FromEmail != User.Identity.Name)
                    {
                        <div class="eee" data-toemail="@mes.FromEmail" data-toname="@mes.FromName">
                            <h2>
                                @(mes.FromName)
                                @if (mes.ReadState == 0)
                                {
                                    <span id="red" style="color:red;">&nbsp;&nbsp;&nbsp;&nbsp;(未读)</span>
                                }
                            </h2>
                        </div>
                    }
                    else
                    {
                        <div class="eee" data-toemail="@mes.ToEmail" data-toname="@mes.ToName">
                            <h2>
                                @(mes.ToName)
                            </h2>
                        </div>
                    }
                }
            </div>
        </div>
        <div style="width:70%;float:right;">
            <div id="message">
            </div>
            <div>
                <textarea id="body" class="form-control" style="height:80px"></textarea>
                <button id="save" onclick="btnSendMsg()" style="background-color: #79CDCD;float:right;width:10%;height:30px;" data-loading-text="发送中..." disabled="disabled">发送</button>
            </div>
        </div>
    </div>
</div>

